import { Redirect } from 'react-router-dom'
import { Route } from 'react-router-dom'
import { Switch } from 'react-router-dom'
import { HashRouter as Router } from 'react-router-dom'
import React, { Component } from 'react'
import Nowplaying from './films/Nowplaying'
import Comingsoon from './films/Comingsoon'
import store from '../redux/store'

export default class Films extends Component {
  state ={
    city:store.getState().CityReducer.city
  }
  handleClick1(){
    this.props.history.push('/films/nowplaying')
  }
  handleClick2(){
    this.props.history.push('/films/commingsoon')
  }
  render() {
    return (
      <div>
        <span>小轮播</span>
        <div onClick={()=>{
          this.props.history.push('/city')
        }}>{this.state.city}</div>
        <Router>
          <ul>
            <li onClick={()=>{
              this.handleClick1()
            }}>正在热映</li>
            <li onClick={()=>{
              this.handleClick2()
            }}>即将上映</li>
          </ul>
          <Switch>
            <Route path='/films/nowplaying' component={Nowplaying}></Route>
            <Route path='/films/commingsoon' component={Comingsoon}></Route>
            <Redirect from='/films' to='/films/nowplaying'></Redirect>
          </Switch>
        </Router>
      </div>
    )
  }
}